﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>OrderManage</title>

    <link href="~/Content/BootStrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="~/Content/BootStrap/css/bootstrap-theme.min.css" rel="stylesheet" />
    <link href="~/Content/BootStrap/css/docs.min.css" rel="stylesheet" />
    <link href="~/bootstrapvalidator-master/dist/css/bootstrapValidator.min.css" rel="stylesheet" />

    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    <script src="~/Content/BootStrap/js/bootstrap.min.js"></script>
    <script src="~/Content/BootStrap/js/docs.min.js"></script>
    <script src="~/bootstrapvalidator-master/dist/js/bootstrapValidator.min.js"></script>

    @*日期选择*@
    <link href="~/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
    <script src="~/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.min.js"></script>

    <script src="~/bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
</head>
<body>
    <div class="container">
        <div class="row clearfix">
            <div class="col-md-6 column" style="margin-top:10px;">
                <form id="" method="post" class="form-horizontal" action="" enctype="multipart/form-data">
                    <div class="form-group">
                        <div class="col-lg-4">
                            <select class="form-control" name="SearchType" id="SearchType">
                                <option value="1" selected="selected" >订单号</option>
                            </select>
                        </div>
                        <div class="col-lg-8">
                            <input type="text" class="form-control" placeholder="要搜索的内容" id="Search" name="Search"/>
                        </div>
                    </div>
                    <div class="form-group" hidden="true">
                        <label class="col-lg-4 control-label text-right" for="Status">订单状态</label>
                        <div class="col-lg-8">
                            <select class="form-control" name="Status" id="Status">
                                <option value="9" selected="selected">全部</option>
                                <option value="0">未发货</option>
                                <option value="1">已发货</option>
                                <option value="2">已送达</option>
                                <option value="3">已收货</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-4 control-label text-right" for="IfPay">付款状态</label>
                        <div class="col-lg-8">
                            <select class="form-control" name="IfPay" id="IfPay">
                                <option value="2" selected="selected">全部</option>
                                <option value="0">已支付</option>
                                <option value="1">未支付</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-4 control-label text-right" for="order">顺序</label>
                        <div class="col-lg-8">
                            <select class="form-control" name="order" id="order">
                                <option value="0" selected="selected">正序</option>
                                <option value="1">倒序</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-4 control-label text-right" for="PageNum">每页显示条数</label>
                        <div class="col-lg-8">
                            <select class="form-control" name="PageNum" id="PageNum">
                                <option value="5" selected="selected">5</option>
                                <option value="10">10</option>
                                <option value="15">15</option>
                                <option value="20">20</option>
                                <option value="25">25</option>
                            </select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="col-md-6 column" style="margin-top:10px;">
                <form id="time"  method="post" class="form-horizontal" action="" enctype="multipart/form-data">
                    <div class="form-group">
                        <label for="Start" class="col-md-2 control-label">起始时间</label>
                        <div class=" col-md-8">
                            <div class="input-group date form_start" data-date-format="yyyy-mm-dd hh:ii:ss" data-link-field="Start">
                                <input class="form-control" size="16" type="text" value="" id="Start" name="Start" readonly>
                                <span class="input-group-addon"><i class="glyphicon glyphicon-remove"></i></span>
                                <span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span>
                            </div>
                        </div>
                        <input type="hidden"  value="" /><br />
                    </div>
                    <div class="form-group">
                        <label for="End" class="col-md-2 control-label">结束时间</label>
                        <div class="col-md-8">
                            <div class="input-group date form_end " data-date-format="yyyy-mm-dd hh:ii:ss" data-link-field="End">
                                <input class="form-control" size="16" type="text" value="" readonly id="End" name="End">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                            </div>
                        </div>
                        <input type="hidden" value="" /><br />
                    </div>
                    <div class="form-group">
                        <div class="col-md-2"></div>
                        <div class="col-md-4">
                            <input type="button" class="btn btn btn-primary" value="筛选" onclick="screen()"/>
                        </div>
                        
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div></div>
    <div id="OrderSearch"> 
        @Html.Action("_OrderSearch", "Order",new { Page=1})
    </div>
    <script type="text/javascript">
        $('.form_start').datetimepicker({
            language: 'zh-CN',
            weekStart: 1,
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            forceParse: 0,
            showMeridian: 1
        })
        .on('hide', function (e) {
            $('#time').data('bootstrapValidator')
            .updateStatus('Start', 'NOT_VALIDATED', null)
            .validateField('Start');
        });
        $('.form_end').datetimepicker({
            language: 'zh-CN',
            weekStart: 1,
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            forceParse: 0,
            showMeridian: 1
        })
        .on('hide', function (e) {
            $('#time').data('bootstrapValidator')
            .updateStatus('End', 'NOT_VALIDATED', null)
            .validateField('End');
        });



        $('#time').bootstrapValidator({
            message: '该值无效',
            feedbackIcons: {

            },
            fields: {
                Start: {
                    message: '开始时间无效',
                    validators: {
                        callback: {
                            message: '您输入了结束时间，请输入开始时间',
                            callback: function (value, validator) {
                                var End = $("#End").val();
                                var Start = $("#Start").val();
                                if (End != '' && Start == '')
                                {
                                    return false;
                                }
                                if (Start != '' && End != '') {
                                    var startTime = new Date(Start.replace("-", "/").replace("-", "/"));
                                    var endTime = new Date(End.replace("-", "/").replace("-", "/"));
                                    if (endTime < startTime) {
                                        return false;
                                    }
                                }
                                return true;
                            }
                        }

                    }
                },
                End: {
                    message: '结束时间无效',
                    validators: {
                        callback: {
                            message: '请输入正确的结束时间',
                            callback: function (value, validator) {
                                var End = $("#End").val();
                                var Start = $("#Start").val();
                                if (Start != '' && End == '')
                                {
                                    return false;
                                }
                                if (Start != '' && End != '') {
                                    var startTime = new Date(Start.replace("-", "/").replace("-", "/"));
                                    var endTime = new Date(End.replace("-", "/").replace("-", "/"));
                                    if (endTime < startTime) {
                                        return false;
                                    }
                                }
                                return true;
                            }
                        }
                    }
                }
            }
        });
        //筛选
        function screen()
        {
            $("#time").bootstrapValidator('validate');
            if ($("#time").data("bootstrapValidator").isValid() == true)
            {
                JumpPage(1);
            }
        }
        //切换每页多少行
        $("#PageNum").change(function () {
            JumpPage(1);
        });

        function JumpPage(Page){
            var IfPay = $("#IfPay").val();
            var Status = $("#Status").val();
            var SearchType = $("#SearchType").val();
            var order = $("#order").val();
            var Search = $("#Search").val();
            var Start = $("#Start").val();
            var End = $("#End").val();
            var PageNum = $("#PageNum").val();
            $.ajax({
                cache: false,//是否从缓存中读取
                type: 'post',//方式
                url: '@Url.Action("_OrderSearch", "Order")',//地址
                data: { Page: Page, IfPay: IfPay, Status: Status, SearchType: SearchType, order: order, Search: Search, Start: Start, End, End, PageNum: PageNum},
                dataType: 'text',//返回数据格式
                success: function (data) {
                    $("#OrderSearch").html(data);
                },
                error: function () {
                    alert("Ajax调用出错请与管理员联系");
                }
            });
        }
        //切换快递时清空提示内容
        $("#CCode").change(function () {
            $("#CCodePrompt").html("");
        });


        function Down(Pages) {
            var form = $("<form>");//定义一个form表单  
            form.attr("style", "display:none");
            form.attr("target", "");
            form.attr("method", "post");
            form.attr("action", "ExportOrder");

            var IfPay = $("<input>");
            IfPay.attr("type", "hidden");
            IfPay.attr("name", "IfPay");
            IfPay.attr("value", $("#IfPay").val());

            var SearchType = $("<input>");
            SearchType.attr("type", "hidden");
            SearchType.attr("name", "SearchType");
            SearchType.attr("value", $("#SearchType").val());

            var Status = $("<input>");
            Status.attr("type", "hidden");
            Status.attr("name", "Status");
            Status.attr("value", $("#Status").val());

            var order = $("<input>");
            order.attr("type", "hidden");
            order.attr("name", "order");
            order.attr("value", $("#order").val());

            var Search = $("<input>");
            Search.attr("type", "hidden");
            Search.attr("name", "Search");
            Search.attr("value", $("#Search").val());

            var Start = $("<input>");
            Start.attr("type", "hidden");
            Start.attr("name", "Start");
            Start.attr("value", $("#Start").val());

            var End = $("<input>");
            End.attr("type", "hidden");
            End.attr("name", "End");
            End.attr("value", $("#End").val());
            
            var PageNum = $("<input>");
            PageNum.attr("type", "hidden");
            PageNum.attr("name", "PageNum");
            PageNum.attr("value", $("#PageNum").val());

            var Page = $("<input>");
            Page.attr("type", "hidden");
            Page.attr("name", "Page");
            Page.attr("value", Pages);

            $("body").append(form);//将表单放置在web中  

            form.append(IfPay);
            form.append(SearchType);
            form.append(Status);
            form.append(order);
            form.append(Search);
            form.append(Start);
            form.append(End);
            form.append(PageNum);
            form.append(Page);

            form.submit();//表单提交  
        }



    </script>
    
</body>
</html>
